{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.min.css">
	<link rel="stylesheet" href="{% static 'css/global.css' %}">
	<script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
	<script src="http://cdn.bootcss.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
	<script type="text/javascript">
		function loginAction() {
			username = $("#username_login").val();
			password = $("#password_login").val();
			$.post("{% url 'user:login' %}", {
				"username": username,
				"password": password
			}, function (data) {
				data = eval(data);
				if (data["status"] == "") location.reload();
				else {
					$("#login_form").addClass("has-error");
				}
			});
		}

		$(document).ready(function () {
			$("#username_login,#password_login").keypress(function (event) {
				$("#login_form").removeClass("has-error");
				if (event.which == 13) loginAction();
			});
		});
	</script>
	{% block head %}

	{% endblock head %}
	<title>PlayAI</title>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
	<div class="container-fluid">
		<div class="navbar-header">
			<a href="{% url 'index' %}" class="navbar-brand">PlayAI</a>
		</div>
		<ul class="nav navbar-nav">
			<li><a href="{% url 'game:gamelist' %}">游戏列表</a></li>
			<li><a href="#">比赛列表</a></li>
		</ul>
		<ul class="nav navbar-nav navbar-right">
			{% if user.is_authenticated %}
				<li><a href="{% url 'user:index' %}">{{ user.username }}</a></li>
				<li><a href="{% url 'user:logout' %}">注销</a></li>
			{% else %}
				<li>
					<form id="login_form" class="navbar-form">
						<input type="text" name="username_login" id="username_login" class="form-control" placeholder="Username">
						<input type="password" name="password_login" id="password_login" class="form-control"
						       placeholder="Password">
					</form>
				</li>
				<li><a onclick="loginAction();" href="#" id="login">登录</a></li>
				<li><a href="{% url 'user:register' %}">注册</a></li>
			{% endif %}
		</ul>
	</div>
</nav>
{% block body %}

{% endblock body %}
</body>
</html>